import ChartBase from "./chart-base";
import { deepClone, mergeObject } from "@/utils";
import {
  grid,
  legend,
  tooltip,
  xAxis,
  yAxis,
  gridConfig,
  legendConfig,
  xAxisConfig,
  yAxisConfig,
  tooltipConfig,
  barSeries,
  barSeriesLabel,
  barSeriesConfig,
  barSeriesLabelConfig,
} from "./common";

export default class BarBase extends ChartBase {
  constructor() {
    super();
  }

  // 基础描述
  _info = {
    name: "基础柱状图",
    type: "bar-base", // 图表类型

    group: "bar", // 图表分类
    component: "e-chart",
    icon: "bar-base", // 图表展示ICON
  };

  // 总 配置项
  _defaultOption = {
    dataset: {
      source: [],
      dimensions: [],
    },
    grid,
    legend,
    tooltip,
    // tooltip: {
    //   confine: false,
    //   position: "right",
    // },
    xAxis,
    yAxis,
    series: [],
  };
  // 系列
  _defaultSeries = {
    type: "bar",
    ...barSeries,
    label: barSeriesLabel,
  };

  // 数据结构描述
  _dataPoolConfig = [
    {
      label: "类目轴",
      key: "xField",
      type: ["string", "date", "number"],
      limit: 1,
    },
    {
      label: "数值轴",
      key: "yField",
      type: ["number"],
      limit: -1,
    },
  ];

  // 样式配置描述信息
  _styleOptionConfig = [
    ...gridConfig,
    ...legendConfig,
    ...tooltipConfig,
    ...xAxisConfig,
    ...yAxisConfig,
    ...barSeriesConfig,
    ...barSeriesLabelConfig,
  ];

  getClickData(event) {
    const { name, seriesName, value } = event;

    return {
      label: name,
      value: value[seriesName],
    };
  }
}
